@charset'UTF-8';
 /**
 * 圣诞节圣诞树
 * @Author river
 * @email lijiang@ymatou.com
 * @Date 2015/12/11
 */
 @import'../_components/variables.scss';
 @import'../_components/_mixin.scss';
 @import'../_components/reset.scss';
 @import'../_components/button.scss';

 @import'../assets/ymtUI.scss';
 @import'../assets/ymt_components.scss';

 @import'../assets/common.scss';

 $imgPath:'/images/christmas/';
 $imgPath:'http://staticontent.ymatou.com/images/activity/christmas/';

 .tree-container{
   background: #5f1211;
 }

.icon-start{
  background-image:url();
   @extend .bg__full;
  width:$rem*33;     
  height:$rem*38;     
  display: inline-block;
      vertical-align: bottom;
}

.tree-btn{
    background:#cc3333;
    color:#fff;
    border-radius:$rem*12;
    height: $rem*80;
    margin-top:$rem*20;
    font-size: $rem*35;
    &.invalid{
      background:#cecece;
    }
}
.tree-options{
  overflow: hidden;
   //background-image:url(#{$imgPath}make_wish_bg.jpg);
   background: -webkit-gradient(radial, 105 105, 100, 112 220, 500, from(rgba(255, 48, 0,.3)),to(rgba(95, 18, 17,1))),;
   height:$rem*446;
       background-size: cover;
     
  .hd{
    color:#fff2cf;
    padding:$rem*20 $rem*24;
    font-size:$rem*24;
  }
}
//许愿表单
.wish-form{
  height:$rem*606;
  background-color:#fff2cf;
  background-image:url(#{$imgPath}mask_mish_bg.png);
  background-position:bottom;
  padding:$rem*20 $rem*24;
  .hd{
    margin-bottom:$rem*20;
    color:#993900;
    font-size:$rem*25;
  }
  @extend .bg__full;
  .content{
    width:100%;
    border-radius:$rem*12;
    padding:$rem*24;
    height:$rem*160;
    color: #6a4923;
    border:0;
    font-size:$rem*28;
    ::placeholder{
       color:#d2c4b4;
    }
  }
}

.tree-kind-list{
  white-space: nowrap;
  .tree-kind-item{
    width:$rem*300;
    height:$rem*300;
    border:1px solid #d68f72;
    margin-right:$rem*10;
    padding:$rem*15;
    position:relative;
    /* float: left; */
    display: inline-block;

    &.selected{
      background:rgba(255,242,207,0.2);
      &:before{
        content: '';
        position: absolute;
        border-left:3px solid #843228;
        border-bottom:3px solid #843228;
        height: $rem*10;
        width:$rem*20;
        right: $rem*18;
            bottom: $rem*26;
            z-index: 2;
            transform: rotate(-45deg);
      }
      &:after{
        content: ' ';
        text-align:center;
        height: $rem*42;
        line-height: $rem*42;
        width:$rem*42;
        background:#fff;
        color:#843228;
        border-radius:50%;
        position: absolute;
        bottom:$rem*10;
        right: $rem*10;
      }
    }
  }
}
.tree-sm{
  width:100%;
  height: 100%;
  margin: 0 auto;
  @extend .bg__full;
  background-image::url(#{$imgPath}tree_sm_04.png);
}

@for $i from 1 to 5 {
    .tree-sm-#{$i}{
        background-image::url(#{$imgPath}tree_0#{$i}.png);
    }
}

.ymtui-toast{
  font-size:$rem*24;
}

//弹层
.christmas-dialog{
  .ymtui-commirm-bd{
    font-size:$rem*33;
  }
  .btn{
    width:$rem*240;
    height: $rem*70;
  }
}
.icon-deer{
  background-image:url();
   @extend .bg__full;
  width:$rem*38;     
  height:$rem*33;     
  display: inline-block;
      vertical-align: bottom;
}